@import url(spectre.css);
@import url(spectre-icons.css);

body{
  background: #f1f1f1;
}
.padding-30{
  padding: 15px 20px;
  background: #fff;
}
.mt-top{
  margin-top: 20px;
}
.big-font{
  font-size:120%;
}
.navbar-background{
  background: #ffffff;
  min-height: 50px;
  line-height:50px;
  box-shadow: 0 0.1rem 0.1rem rgba(69, 77, 93, 0.16);
}
.navbar{
  //background: rgba(241, 241, 241, 0.73);
  //font-weight: 300;
}

.index_menu {
  background: #051f2e!important;
  & .btn.btn-link{
    color:#ccc;
    &:hover{
      background: rgba(241, 241, 241, 0.10);
    }
  }

}
.menu .menu-item > a{
  text-align: left;
}

.navbar-section a{
  display: block;
  padding:0 7px;
  height: 50px;
  line-height: 50px;
  &:hover{
    color: #8689a0!important;
    background: rgba(241, 241, 241, 0.55);
  }
}

.login-panel{
  width: 400px;
  margin:50px auto;
  padding: 20px;
}
.login-panel-background{
  background: rgba(241, 241, 241, 0.73);
  width: 100%;
  height: 200%;
  float: left;
}

.btn-delete:hover{
  border-color:#F44336;
  background: #F44336;
}

.btn-order:hover{
  border-color:#4CAF50!important;
  background:#4CAF50!important;
}

.btn-host:hover{
  border-color:#FF9800 !important;
  background:#FF9800 !important;
}

.host-info{
  padding:10px;
  & h5{
    margin-bottom:1rem;
    & .label{
      margin-left: 10px;
    }
  }
}

.host-detail{
  line-height:2;
  & li{
    margin-top: 0px;
  }
}

.host-tips{
  font-size:1rem;
  border-radius: 0px;
}

.buy-btn{
  display: block;
  width: 100%;
  height: auto;
  background: rgba(255, 87, 34, 0.85);
  padding: 1rem;
  color: #fff;
  text-align: center;
  border:0px;
  &:active {
    text-decoration: none;
    color: #fff;
  }
  &:hover{
    text-decoration: none;
    color:#fff;
    background: #FF5722;
    -webkit-transition: 200ms;
    -moz-transition: 200ms;
    -ms-transition: 200ms;
    -o-transition: 200ms;
    transition: 200ms;
  }
}

.order-item{
  background: #ffffff;
  padding:1.5rem 1.2rem;
  width: 100%;
  height:auto;
  border-top: 1px solid #eee!important;
  line-height:2;
  & span{
    margin-left:7px;
  }
  & h6{
    margin-bottom:1rem;
  }
  & label{
    margin-left: 7px;
  }
  & .model-label{
    margin-left: 10px;
  }
}

.my_host_item{
  background: #fff;
  float: left;
  text-align: center;
  border-top: 1px solid #f1f1f1;
  & .model-label{
    font-weight:300;
  }
  & h6{
    margin-bottom:1rem;
  }
  & label{
    margin-left: 7px;
  }
  & p{
    margin:0rem;
    line-height:2;
  }
  &:nth-child(3n-1){
    border-right: 1px solid #f1f1f1;
  }
  &:nth-child(3n+1){
    border-left: 1px solid #f1f1f1;
  }
  & p small{
    opacity: 0.8;
  }
  & .status{
    font-size: 95%;
  }
}

.item-title{
  padding:1rem 1.2rem;
  background: #fff;
  font-size:80%;
  //border-bottom: 1px solid #eee;
  border-left: 1px solid #2196F3;
}

.host-btn-panel{
  margin-top: 0px;
  & .btn:first-child{
    margin-left:0px;
    color:#2196F3;
  }
  & .btn{
    margin-left:-5px;
    color:#2196F3;
  }
}

.new_ticket_btn{
  margin-left: 10px;
  float: right;
}

.ticket-panel{
  background: #fff;
  & a{
    color:#8689a0;
  }
}
.ticket-content{
  line-height:2;
}

.ticket-tail{
  color: #aaaaaa;
}

.footer{
  text-align: center;
  margin-top:10px;
  width: 100%;
  //background-color: #fff;
  padding: 10px;
}

.index_img{
  width:100%;
  height:auto;
}

.index_info{
  width:100%;
  height:auto;
  padding:1rem;
  background: #fff;
  margin-top: 5px;
  border-left: 1px solid #2196F3;
}

.admin-info {
  padding:1rem;
  background: #fff;
  font-size: 80%;
  border-left: 1px solid #2196F3;
}

.aff-info{
  padding:1rem;
  background: #fff;
  line-height:2;
  //font-size: 80%;
  //border-left: 1px solid #2196F3;
  //font-weight: 300;
  margin-bottom:0px;
  margin-top: 0px;
  border-top:1px solid #eee !important;
  text-align: center;
  & input{
    font-weight: 300;
    border:none;
    width: 200px;
    text-align:left;
  }
}

.index-panel{
  line-height:2.4rem;
  & .grid-960{
   padding:25px 10px;
  }
  & .content{
    padding:0px;
    & .col-md-4{
      text-align: center;
    }
  }
  & h2{
    font-size: 1.6em;
  }
  & li{
    list-style: none;
    line-height:1.8em;
    letter-spacing: 1px;

    & i{
      width:30px;
    }
  }

  & i{
    width:20px;
  }
  letter-spacing: 1px;
}

.index-shop{
  width:61%;
  height:80px;
  margin:20px auto 30px auto;
  text-align: center;

  & span{
    display: inline-block;
    font-size: 1.2em;
    font-weight: 300;
    margin-top:10px;
    & a{
      color:#50596c;
      letter-spacing: 5px;
      -webkit-transition: 300ms;
      -moz-transition:  300ms;
      -ms-transition:  300ms;
      -o-transition:  300ms;
      transition:  300ms;
      &:hover{
        text-decoration: none;
        letter-spacing: 10px;
      }
    }
  }
  & i{
    float: left;
    width: 100%;
  }

}